<template>
	<view>
		<view class="u-text-center u-padding-15"><u-swiper class="swiper_con" height="300rpx" :list="list" borderRadius="10"></u-swiper></view>
		<view class="u-padding-20 main_con1">
			<!-- 身份：超级管理员、物业经理 -->
			<view v-if="type == 2 || type == 1">
				<view class="responsible_con">
					<text class="u-font-30 r_title">查看</text>
					<view class="shadow_border u-padding-20">
						<view
							class="type_list"
							v-for="(item, index) in jobList"
							:key="index"
							@click="tomessageCenter(item.method)"
							v-if="item.method == 'notice' || item.method == 'report' || item.method == 'examine'"
						>
							<image :src="item.icon" mode="heightFix"></image>
							<text>{{ item.name }}</text>
						</view>
					</view>
				</view>
				<view class="responsible_con">
					<text class="u-font-30 r_title">管理</text>
					<view class="shadow_border">
						<u-grid col="3">
							<u-grid-item
								v-for="(item, index) in jobList"
								:key="index"
								@click="tomessageCenter(item.method)"
								v-if="item.method != 'notice' && item.method != 'report' && item.method != 'examine'"
							>
								<!-- <u-badge :count="index" :offset="[40, 50]"></u-badge> -->
								<u-icon
									:customStyle="{ paddingTop: 20 + 'rpx' }"
									:name="item.icon"
									:width="80"
									:height="80"
									style="border-radius: 20rpx;"
									imgMode="heightFix"
								></u-icon>
								<view class="grid-text">{{ item.name }}</view>
							</u-grid-item>
						</u-grid>
					</view>
				</view>
			</view>
			<!-- 门岗、客服、维修 -->
			<view class="nav_con" v-else>
				<u-grid col="2">
					<u-grid-item v-for="(item, index) in jobList" :key="index" @click="tomessageCenter(item.method)">
						<!-- <u-badge :count="index" :offset="[40, 50]"></u-badge> -->
						<u-icon :customStyle="{ paddingTop: 20 + 'rpx' }" :name="item.icon" :width="80" :height="80" style="border-radius: 20rpx;" imgMode="heightFix"></u-icon>
						<view class="grid-text">{{ item.name }}</view>
					</u-grid-item>
				</u-grid>

				<u-toast ref="uToast" />
			</view>
		</view>
		<!-- 弹框提示 -->
		<u-toast ref="uToast" />
		<u-tabbar v-model="current" height="110rpx" activeColor="#0c838b" :list="vuextabbar" :mid-button="false"></u-tabbar>
	</view>
</template>

<script>
import { getNav, getBanner } from '@/service/indexService.js';
import cookie from '@/util/store/cookie';
export default {
	data() {
		return {
			current: 0,
			keyword: '',
			src: 'http://www.gsxcxh.com/static/upload/image/20220412/1649756273277860.jpg',
			isshow: false,
			jobList: [],
			list: [],
			type: 0
		};
	},
	mounted() {
		getNav().then(this.getNav);
		getBanner({
			type: 0
		}).then(this.getBanner);
	},
	onLoad() {
		this.type = cookie.get('type');
	},
	computed: {
		vuextabbar() {
			let tabbar = this.$store.state.vuex_tabbar;
			let messageNum = this.$store.state.messageNum;
			tabbar[2].count = messageNum;
			return tabbar;
		}
	},
	methods: {
		getNav(e) {
			// console.log(e.result);
			if (e.code == 200) {
				this.jobList = e.result.nav;
			}
		},
		getBanner(e) {
			// console.log(e.result);
			if (e.code == 200) {
				// console.log(e);
				this.list = e.result;
			}
		},
		tomessageCenter: function(method) {
			if (method == 'notice') {
				uni.navigateTo({
					url: './messageCenter'
				});
			} else if (method == 'repair') {
				uni.navigateTo({
					url: './snatchOrder'
				});
			} else if (method == 'patrol') {
				uni.navigateTo({
					url: '/pages/patrol/index'
				});
			} else if (method == 'share') {
				uni.navigateTo({
					url: '/pages/neighborsEnjoy/neighborsType'
				});
			} else if (method == 'doorpost') {
				uni.navigateTo({
					url: '/pages/index/visitors'
				});
			} else if (method == 'collection') {
				uni.navigateTo({
					url: '/pages/index/propertyfee'
				});
			} else if (method == 'active') {
				uni.navigateTo({
					url: '/pages/index/Activities'
				});
			} else if (method == 'report') {
				uni.navigateTo({
					url: '/pages/managerJobs/userAdvice'
				});
			} else if (method == 'staff') {
				uni.navigateTo({
					url: '/pages/managerJobs/addressBook'
				});
			} else if (method == 'topic') {
				uni.navigateTo({
					url: '/pages/managerJobs/activityTopic'
				});
			} else if (method == 'examine') {
				uni.navigateTo({
					url: '/pages/managerJobs/propertyReview'
				});
			} else if (method == 'assets') {
				uni.navigateTo({
					url: '/pagesProperty/fixedAssets/index'
				});
			} else if (method == 'purchase') {
				uni.navigateTo({
					url: '/pagesProperty/fixedAssets/procurement'
				});
			} else if (method == 'receive') {
				uni.navigateTo({
					url: '/pagesProperty/fixedAssets/receiveAsset'
				});
			}else if(method=='e_repair'){
				uni.navigateTo({
					url: '/pages/erepair/index'
				});
			} else {
				this.$refs.uToast.show({
					type: 'error',
					title: '正在开发中',
					icon: false
				});
			}
		}
	}
};
</script>

<style lang="scss">
.ava_con {
	color: #fff;
	height: 280rpx;
	// padding:60rpx 0;
	border-radius: 15rpx;
	overflow: hidden;
	// background-color: #006971;
}
.ava_con image {
	width: 100%;
	height: 100%;
}
.nav_con {
	background-color: #fff;
	border-radius: 15rpx;
	margin-top: 20rpx;
	box-shadow: 5rpx 5rpx 20rpx #ddd;
}
.grid-text {
	font-size: 28rpx;
	margin-top: 30rpx;
}
.r_title {
	display: block;
	padding: 30rpx 0;
}
.shadow_border {
	// padding:20rpx 0;
	border-radius: 10rpx;
	box-shadow: 0 0 10rpx #ccc;
}
.type_list {
	display: inline-block;
	width: 33%;
	font-size: 30rpx;
	text-align: center;
	padding: 20rpx 10rpx;
}
.type_list1 {
	width: 50%;
	margin: 50rpx 0;
	padding: 0 30rpx;
}
.type_list image {
	display: block;
	width: 80rpx;
	height: 80rpx;
	margin: 0 auto 10rpx;
}
.count_con {
	font-size: 20rpx;
	color: #fff;
	width: 35rpx;
	height: 35rpx;
	line-height: 35rpx;
	text-align: center;
	border-radius: 50%;
	top: 0rpx;
	right: 120rpx;
	background-color: red;
}
</style>
